<template>
	<basic-container>
		<avue-crud
			:option="option"
			:data="data"
			ref="crud"
			v-model="form"
			:table-loading="loading"
			:permission="permissionList"
			:page="page"
			@refresh-change="refreshChange"
			@search-change="searchChange"
			@search-reset="searchReset"
			@current-change="currentChange"
			@size-change="sizeChange"
			@on-load="onLoad"
		>
			<template slot="search">
				<el-col :md="8" :xs="16">
					<el-form-item label="周期" >
						<el-date-picker
							text="有效期"
							v-model="cicleTime"
							type="datetimerange"
							range-separator="至"
							size="mini"
							start-placeholder="开始日期"
							:default-time="['00:00:00', '23:59:59']"
							end-placeholder="结束日期"
							align="right"
							format="yyyy-MM-dd HH:mm:ss"
							value-format="yyyy-MM-dd HH:mm:ss"
						></el-date-picker>
					</el-form-item>
				</el-col>
			</template>
			<template slot-scope="scope" slot="orderId">
				<div @click="showOrderDetail(scope.row.orderId, scope.row.userName)">{{ scope.row.orderId }}</div>
			</template>
			<template slot-scope="scope" slot="menu">
				<el-button type="text" size="small" @click="viewDetail(scope.row.id)" >查看明细</el-button>
			</template>
		</avue-crud>
		<el-dialog width="70%" :visible.sync="viewDialogFormVisible" title="结算明细" @close="closeDialog" append-to-body :close-on-click-modal="false">
			<avue-crud
				:option="optionView"
				:data="dataView"
				ref="crudView"
				v-model="formView"
				:table-loading="loadingView"
				:permission="permissionList"
				:page="pageView"
				@refresh-change="refreshChangeView"
				@search-change="searchChangeView"
				@search-reset="searchResetView"
				@current-change="currentChangeView"
				@selection-change="selectionChange"
				@size-change="sizeChangeView"
				@expand-change="expandChanges"
			>
				<template slot-scope="scope" slot="orderId">
					<div @click="showOrderDetail(scope.row.orderId, scope.row.userName)">{{ scope.row.orderId }}</div>
				</template>
				<template slot="expand" slot-scope="{ row }">
					<avue-crud ref="crud" :option="option1" :data="rowdata" @on-load="onload(row)">

					</avue-crud>

				</template>
				<template slot-scope="scope" slot="menuLeft">
					<el-button type="primary" @click="outExcel" size="mini">部分导出</el-button>
					<el-button type="primary" @click="outAllExcel" size="mini">全部导出</el-button>
				</template>
				<template slot-scope="row" slot="menu">
					<el-button v-if="row.row.settlementStatue==1" type="text" size="small" @click="sellerconfirmation(row.row.id)">确认</el-button>
				</template>
				<!-- <template slot="searchMenu">
					<el-button type="primary" size="mini">导出</el-button>
				</template> -->
			</avue-crud>
			<el-col class="btnRow" :span="8">
				<el-button  type="primary" size="small" @click="Batchconfirmation">批量确认</el-button>
<!--				<el-button  type="primary" size="small">结算申请</el-button>-->
<!--				<span class="allMoney">总结算金额：{{allMoney}}</span>-->
			</el-col>
			<div slot="footer" class="dialog-footer"><el-button @click="closeDialog">关闭</el-button></div>
		</el-dialog>
	</basic-container>
</template>

<script>
import userAccountLog from '@/components/userAccountLog/userAccountLog';
import { sellercloseAnaccount,sellerdetails,sellerdetailsFormGoods,sellerconfirmation } from '@/api/order/orderForm';
import { mapGetters } from 'vuex';
import { getToken } from '@/util/store';
var Dict = JSON.parse(localStorage.getItem('mall-dictionary')).content;
export default {
	data() {
		return {
			idList:[],
			form: {},
			formView: {},
			cicleTime: [],
			ids:[],
			idszt:false,
			viewDialogFormVisible: false,
			dialogDeatilVisible: false,
			query: {
				uaType: 2
			},
			loading: true,
			queryView: {
				uaType: 2
			},
			loadingView: true,
			settlementMainId:'',
			data: [

			],
			dataView: [

			],
			page: {
				pageSize: 10,
				currentPage: 1,
				total: 0
			},
			pageView: {
				pageSize: 10,
				currentPage: 1,
				total: 0
			},
			//页面加载展示用的option
			option: {
				size: 'mini',
				addBtn: false,
				editBtn: false,
				delBtn: false,
				viewBtn: false,
				align: 'center',
				tip: false,
				border: true,
				rowKey: 'id',
				indexLabel:'序号',
				index: true,
				menuWidth: 100,
				searchMenuSpan: 6,
				column: [
					{
						label: '周期',
						prop: 'cycle',
					},
					{
						label: '总收入',
						prop: 'sumIncome',
					},
					{
						label: '结算金额',
						prop: 'settlementAmount',
					},
					{
						label: '平台抽佣金额',
						prop: 'platformCommission',
					},
				]
			},
			objview: {},
			optionView: {
				size: 'mini',
				addBtn: false,
				editBtn: false,
				delBtn: false,
				viewBtn: false,
				align: 'center',
				tip: false,
				border: true,
				rowKey: 'id',
				// excelBtn:true,
				expand: true,
				expandRowKeys:[],
				selection: true,
				selectable:(row)=>{
					// if(row.isManageGoods){
						return true
					// }else{
					// 	return false
					// }
				},
				menuWidth: 100,
				searchMenuSpan: 8,
				column: [
					{
						label: '店铺名称',
						prop: 'storeName',
					},
					{
						label: '订单编号',
						prop: 'orderNo',
					},
					{
						label: '下单时间',
						prop: 'orderTime',
					},
					{
						label: '支付时间',
						prop: 'payTime',
					},
					{
						label: '结算状态',
						search:true,
						type:"select",
						prop: 'settlementStatue',
						dicData: Dict.settlementStatusTypeEnum,
					},
					{
						label: '结算价',
						prop: 'settlementPrice',
					},
					{
						label: '佣金额',
						prop: 'commissionAmount',
					},
					{
						label: '订单状态',
						prop: 'orderStatus',
						dicData: Dict.orderStatusEnum,
					},
					{
						label: '收货人姓名',
						prop: 'receiverName',
					},
					{
						label: '联系方式',
						prop: 'receiverMobile',
					},
					{
						label: '收货地址',
						prop: 'receiveAddress',
					},
					{
						label: '支付方式',
						prop: 'payWay',
						dicData: Dict.payWayEnum,
					},
					{
						label: '买家备注',
						prop: 'buyerMsg',
					},
					{
						label: '业务发生区域',
						prop: 'regionalOrganization',
						searchLabelWidth:100,
						searchSpan: 6,
						rules: [
							{
								required: true,
								message: '请输入业务发生区域',
								trigger: 'blur'
							}
						]
					},
					{
						label: '业务发生单元',
						prop: 'businessUnitOrganization',
						searchSpan: 6,
						searchLabelWidth:100,
						rules: [
							{
								required: true,
								message: '请输入业务发生单元',
								trigger: 'blur'
							}
						]
					},
					{
						label: '业务发生项目',
						prop: 'itemOrganization',
						searchSpan: 6,
						searchLabelWidth:100,
						rules: [
							{
								required: true,
								message: '请输入业务发生项目',
								trigger: 'blur'
							}
						]
					},
					{
						label: '区域',
						prop: 'queryOrganization',
						search: true,
						searchSpan: 6,
						defaultExpandAll: false,
						dicUrl: '/base/organization/listTree',
						type: 'tree',
						hide:true,
						props: {
							label: 'name',
							value: 'name',
							children: 'childrenNodes'
						}
					},
				]
			},
			allMoney:0,
			option1: {
				border: true,
				header: false,
				menu: false,
				size: 'mini',
				align: 'center',
				menuAlign: 'center',
				column: [
					{
						label: '商品大类名称',
						prop: 'bigClassName'
					},
					{
						label: '商品子类名称',
						prop: 'childClassName',
					},
					{
						label: '商品小类名称',
						prop: 'smallClassName'
					},
					{
						label: '商品名称',
						prop: 'name',
					},{
						label: ' 商品规格',
						prop: 'sku'
					},
					{
						label: '是否是团长分销商品',
						prop: 'isGroupLeaderGroup',
						type:'select',
						dicData: [
							{
								label: "否",
								value: false
							},
							{
								label: "是",
								value: true
							}
						],
					},
					{
						label: '商品单价',
						prop: 'unitPrice',
					},
					{
						label: '商品数量',
						prop: 'count',
					},{
						label: '商品的约定结算价',
						prop: 'promiseSettlementPrice'
					},
					{
						label: '抽佣比例',
						prop: 'promiseSettlementRatio',
					},{
						label: '商家团长自行补贴',
						prop: 'storeGroupLeaderSubsidy'
					},
					{
						label: '商家活动-秒杀立减',
						prop: 'storeSpikeSubtract',
					},
					{
						label: '商家活动-满减立减',
						prop: 'storeFullCutSubtract',
					},{
						label: '商家活动-优惠券立减',
						prop: 'storeCouponSubtract'
					},
					{
						label: '商家活动-其他立减',
						prop: 'storeOtherSubtract',
					},
					{
						label: '退款金额',
						prop: 'refundAmount',
					},{
						label: '买家实付金额',
						prop: 'actualPaymentAmount'
					},
					{
						label: '平台优惠总计',
						prop: 'platformActivityDiscountSum',
					},
					{
						label: '实际结算金额',
						prop: 'actualSettlementAmount',
					},
					{
						label: '商品小计',
						prop: 'note',
					}
				]
			},
			rowdata:[],
		};
	},
	components: {
		userAccountLog
	},
	computed: {
		...mapGetters(['permission', 'userInfo']),
		permissionList() {
			return {};
		}
	},
	methods: {
		//导出对账
		outAllExcel(){
			let token = getToken();
			let settlementMainId = this.settlementMainId === undefined ? "" : this.settlementMainId;
			let adStatus = this.query.adStatus === undefined ? "" : this.query.adStatus;
			let queryOrganization = this.query.queryOrganization === undefined ? "" : this.query.queryOrganization;
			window.location.href =
							'order/sellerSettlementDetail/outExcel?token=' + token +
							'&settlementMainId=' + settlementMainId +
							'&adStatus=' + adStatus +
							'&queryOrganization=' + queryOrganization;
		},
		outExcel(){
			if (this.idList.length > 0){
				let token = getToken();
				let adStatus = this.query.adStatus === undefined ? "" : this.query.adStatus;
				let settlementMainId = this.settlementMainId === undefined ? "" : this.settlementMainId;
				let queryOrganization = this.query.queryOrganization === undefined ? "" : this.query.queryOrganization;
				let idList=this.idList;
				window.location.href =
						'order/sellerSettlementDetail/outExcel?token=' + token +
						'&settlementMainId=' + settlementMainId +
						'&adStatus=' + adStatus +
						'&queryOrganization=' + queryOrganization +
						'&idList=' + idList;
				setTimeout(()=>{
					this.idList = [];
					this.onLoad(this.page, this.query);
				},500)
			}else {
				this.$message({
					type: "error",
					message: "至少选择一笔数据"
				});
			}
		},
		expandChanges(row, expendList) {
			console.log(row);
			console.log(expendList);
			if (expendList.length) {
				this.option.expandRowKeys = [];
				if (row) {
					this.option.expandRowKeys.push(row.$index);
				}
			} else {
				this.option.expandRowKeys = [];
			}
			let obj = {
				settlementDetailId: row.id
			};
			this.sellerdetailsFormGoods(obj, row);
		},
		sellerdetailsFormGoods(obj) {
			sellerdetailsFormGoods(obj).then(res => {
				this.rowdata = res.data.data;
			});
		},
		sellerconfirmation(val){
			let ids={
				ids:val
			}
			sellerconfirmation(ids).then(res => {
				console.log(res,'-------00000')
				if(res.data.code=='200'){
					this.$message({
						message:'确认成功',
						type:'success'
					});
					console.log(this.dataView,'-------')
					this.dataView.forEach(item=>{
						val.split(",").forEach(i=>{
							if(item.id==i){
								item.settlementStatue=2
							}
						})
					})
				}
			});
		},
		onload(val) {
			console.log(val);
		},
		viewDetail(settlementMainId) {
			this.settlementMainId=settlementMainId;
			this.queryView.settlementMainId=settlementMainId;
			this.onLoadView(this.pageView);
			this.viewDialogFormVisible = true;
		},
		closeDialog() {
			this.viewDialogFormVisible = false;
		},
		
		//以下是页面加载店铺需要用到的方法
		searchReset() {
			this.query = {}; // 清空搜索条件时需要保留tab状态对应的用户type
			this.cicleTime = []
			this.query.uaType = 2;
			this.onLoad(this.page);
		},
		searchChange(params, done) {
			this.page.currentPage = 1;
			params.uaType = this.query.uaType;
			if(this.cicleTime[0]){
				params.cycleStartTime = this.cicleTime[0];
			}else{
				params.cycleStartTime = ''
			}
			if(this.cicleTime[1]){
				params.cycleEndTime = this.cicleTime[1];
			}else{
				params.cycleEndTime = ''
			}
			this.query = params;
			this.onLoad(this.page, params, done);
		},
		currentChange(currentPage) {
			this.page.currentPage = currentPage;
		},
		sizeChange(pageSize) {
			this.page.pageSize = pageSize;
		},
		refreshChange() {
			this.onLoad(this.page);
		},
		onLoad(page, params = {}, done) {
			console.log(this.option.column);
			this.loading = true;
			this.query.uaType = 2;
			sellercloseAnaccount(page.currentPage, page.pageSize, Object.assign(params, this.query)).then(res => {
				if(done){
					done();
				}
				this.loading = false;
				const data = res.data;
				console.log(data);
				this.page.total = data.count;
				this.data = data.data;
			});
			console.log(Dict.integralTradeTypeEnum);
		},
		// 选中状态变化时
		selectionChange(list) {
			console.log('selectionList', list);
			this.ids = [];
			this.allMoney=0
			try {
				list.forEach(item => {
					this.ids.push(item.id);
					if(item.settlementStatue==1){
						this.idszt=false
					}else {
						this.idszt=true
						throw Error();
					}
				});
			} catch (e) {
				
			}
			let idList = []
			if (list.length > 0) {
				for (let item of list) {
					idList.push(item.id)
				}
				console.log(idList)
				this.idList = idList
			} else {
				this.idList = [];
			}
		},
		Batchconfirmation(){
			if(this.ids.length==0){
				this.$message({
					message:'请先选择一条明细',
					type:'error'
				});
			}else if(this.idszt){
				this.$message({
					message:'选只有待确认状态下的明细才能确认',
					type:'error'
				});
			}else{
				let val=this.ids.join(",")
				this.sellerconfirmation(val);
			}
		},
		//以下是页面加载店铺需要用到的方法
		searchResetView() {
			this.queryView = {}; // 清空搜索条件时需要保留tab状态对应的用户type
			this.queryView.settlementMainId  = this.settlementMainId
			this.queryView.uaType = 2;
			this.onLoadView(this.pageView);
		},
		searchChangeView(params, done) {
			this.pageView.currentPage = 1;
			this.onLoadView(this.pageView, params, done);
		},
		currentChangeView(currentPage) {
			this.pageView.currentPage = currentPage;
			this.onLoadView(this.pageView);
		},
		sizeChangeView(pageSize) {
			this.pageView.pageSize = pageSize;
			this.onLoadView(this.pageView);
		},
		refreshChangeView() {
			this.onLoadView(this.pageView);
		},
		onLoadView(page, params = {}, done) {
			this.loadingView = true;
			this.queryView.uaType = 2;
			sellerdetails(page.currentPage, page.pageSize, Object.assign(params, this.queryView)).then(res => {
				if(done){
					done();
				}
				this.loadingView = false;
				const data = res.data;
				console.log(data);
				this.pageView.total = data.count;
				this.dataView = data.data;
			});
			console.log(Dict.integralTradeTypeEnum);
		}
	}
};
</script>

<style>
.dialog-footer {
	text-align-last: center;
}
.btnRow {
	position: relative;
	bottom: 51px;
	left: 10px;
}
.allMoney{
	margin-left: 5px;
}
</style>
